<%--
  Created by IntelliJ IDEA.
  User: apple
  Date: 2020/6/19
  Time: 16:37
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>

<%@include file="head.jsp"%>
<body>



<!--广告图-->
<div class="container-fluid page-banner">
    <div class="row">
        <img src="img/pagebanner2.jpg" alt="" class="img-responsive" />
    </div>
</div>

<!--新闻列表 -->
<div class="news">
    <div class="container">
        <div class="row">
            <div class="col-lg-3 col-md-3 col-sm-3 hidden-xs sidebar">
                <!--电脑端页面导航-->
                <ul>
                    <li class="sidebar-title">
                        <h3>多肉作品</h3>
                        <p>ARTICLES</p>
                    </li>
                    <c:if test="${username!=null && username!='admin'}">
                        <li class="sidebar-item">
                            <!--    这里先设置死作者的用户名，回头记得改！       -->
                            <a href="http://localhost:8080/webtest/Homework/Qiantai/articles?action=mypage&currPage=1&writter=${username}"><span class="glyphicon glyphicon-play-circle"></span>&nbsp;&nbsp;我的作品</a>
                        </li>
                    </c:if>
                    <!--<li class="sidebar-item">
                        <a href=""><span class="glyphicon glyphicon-play-circle"></span>&nbsp;&nbsp;常见问题</a>
                    </li>-->
                </ul>
            </div>
            <div class="col-lg-9 col-md-9 col-sm-9 col-xs-12 right-content">
                <!--手机端页面导航-->
                <div class="mobile-nav hidden-md hidden-sm hidden-lg">
                    <div class="mobile-nav-title">
                        <h3>多肉资讯</h3>
                        <p>COMPANY NEWS</p>
                    </div>
                    <div class="mobile-nav-item clearfix">
                        <!--     这里先定死了作者，回头改username！！      -->
                        <a href="http://localhost:8080/webtest/Homework/Qiantai/articles?action=mypage&currPage=1&writter=88888888888"><span class="glyphicon glyphicon-play-circle"></span>&nbsp;我的作品</a>
                        <!--<a href=""><span class="glyphicon glyphicon-play-circle"></span>&nbsp;&nbsp;常见问题</a>-->
                    </div>
                </div>
                <!--面包屑导航-->
                <ol class="breadcrumb bread">
                    <li>
                        <a href="index.jsp">首页</a>
                    </li>
                    <li class="active">多肉作品</li>
                </ol>
                <div class="news-list">
                    <h4 class="content-title">多肉作品 / <small>ARTICLES</small></h4>

                    <c:forEach items="${page.records}" var="n" varStatus="number">
                        <div class="row">
                            <div class="col-lg-4 col-md-4 col-sm-4 news-pic">
                                <img src="img/news-pic${number.index}.jpg" alt="" class="img-responsive center-block" />
                            </div>
                            <div class="col-lg-8 col-md-8 col-sm-8 news-text">
                                <h3><a href="/webtest/Homework/Qiantai/articles?action=page&id=${n.id}">${n.title}</a></h3>
                                <p>
                                    <a href="/webtest/Homework/Qiantai/articles?action=page&id=${n.id}">有些多肉品种的名字你根本叫不出来，因为它们是杂出来的，你可能没想到有多少多肉爱好者在多肉杂交这件事上的兴趣有多浓厚，譬如下文的肉山丨大魔王，杂交了许多多肉，回首移苗，不堪痛 ...</a>
                                </p>
                                <a href="/webtest/Homework/Qiantai/articles?action=page&id=${n.id}" class="readmore hidden-xs">阅读全文</a>
                                <div>

                                    <span class="pull-right"><i class="glyphicon glyphicon-time"></i> ${n.updatetime}</span>
                                </div>
                            </div>
                        </div>
                    </c:forEach>
                    <!--分页-->
                    <nav aria-label="Page navigation" class="page-box">
                        <ul class="pagination">
                            <li>
                                <a href="${pageContext.request.contextPath }/Homework/Qiantai/articles?action=userpage&currPage=1" aria-label="Previous">
                                    <span aria-hidden="true">首页</span>
                                </a>
                            </li>
                            <li>
                                <a href="${pageContext.request.contextPath }/Homework/Qiantai/articles?action=userpage&currPage=${page.currpage-1<=0?1:page.currpage-1}" aria-label="Previous">&laquo;</a>
                            </li>
                            <c:forEach begin="${page.currpage}" end="${page.totalpage}" var="num">
                                <li>
                                    <a href="${pageContext.request.contextPath }/Homework/Qiantai/articles?action=userpage&currPage=${num}">${num}</a>
                                </li>
                            </c:forEach>
                            <li>
                                <a href="${pageContext.request.contextPath }/Homework/Qiantai/articles?action=userpage&currPage=${page.currpage+1 <= page.totalpage?page.currpage+1:page.totalpage}" aria-label="Next">&raquo;</a>
                            </li>
                            <li>
                                <a href="${pageContext.request.contextPath }/Homework/Qiantai/articles?action=userpage&currPage=${page.totalpage}" aria-label="Next">
                                    <span aria-hidden="true">尾页</span>
                                </a>
                            </li>
                        </ul>
                        <ul> 第${page.currpage} 页 / 共${page.totalpage} 页</ul>
                    </nav>
                </div>
            </div>
        </div>
    </div>
</div>

<%@include file="foot.jsp"%>
<script src="js/jquery-1.11.0.js"></script>
<script src="js/bootstrap.min.js"></script>

</body>
</html>
